<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>5.2 数据显示_柱形图_全国城市人工智能岗位平均工资排序</title>
    <!-- 引入刚刚下载的 ECharts 文件 -->
    <script src="./js/echarts.js"></script>
  </head>
  <body>
  <!-- 为 ECharts 准备一个定义了宽高的 DOM -->
  <div id="main" style="width: 600px;height:400px;"></div>
  <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));

    // 指定图表的配置项和数据
    var option = {
        color: ["#3398DB"],
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "shadow"
          }
        }
        grid: {
          show: true
          },
      title: {
        text: '全国城市人工智能岗位平均工资排序'
      },
      tooltip: {},
      legend: {
        data: ['平均工资'],
        right: '2%'
      },

      xAxis: {
        data: ['上海', '北京', '南京', '成都', '西安', '深圳','杭州','武汉','广州']
      },
      name: "城市名称",
      yAxis: {},
      series: [
        {
         name: '平均工资',
         type: 'bar',
         data: [18780,17950,16901,16830,16818,16369,15037,14944,13179]

         }
      ]
    };

     // 使用刚指定的配置项和数据显示图表。
     myChart.setOption(option);
    </script>
  </body>
</html>